Today I will show you how to create a simple Instagram user image fetcher in PHP by using Instagram REST API. This application will use Instagram API to fetch recent 20 photos of public users with the similar name. It also displays likes of each photo. Please note that you can only access photos of users who make their profile public using this API.
If you are not familiar with REST then REST stands for Representational State Transfer which is a way of accessing web services. 75% of web services use REST. You can access a REST service by using a simple HTTP GET or POST requests. The API give output most probably in JSON format and you can decode it in PHP and use it in your application.
I will make a tutorial on how to make your own REST API in PHP Soon. If you are eager to learn How to Create an Instagram Location Image Fetcher using Google map API and Instagram API you can view the detailed tutorial on that by visiting following link.
Now lets starts
Get Latest Images by using Instagram API
The Instagram API's requires an ACCESS TOKEN. Here is the REST API URL. The output is also in JSON Format.
https://api.instagram.com/v1/users/search?q=jack&access_token=ACCESS-TOKEN
https://api.instagram.com/v1/users/{user-id}/media/recent/?access_token=ACCESS-TOKEN
Note: First API is used to fetches users id's of the user with similar username and the second API is used to fetch recent 20 images of that user.
Now in order to get access token, there are again two methods
First Method
Register your app in Instagram developer console https://www.instagram.com/developer/ and get access token by using again using GET Request like below
https://instagram.com/oauth/authorize/?client_id=56df9______b9cad&redirect_uri=http://localhost/test/instagram/&response_type=token&scope=basic+public_content+follower_list+comments+relationships+likes
But this access token can be used to fetch your own information only not any other users. In order to fetch public users information you need to submit your app on Instagram which is a very complex process so the second method
Second Method (Recommended and Easy)
Just visit the following link to get the Access Token.
Once you get the access token then you can easily fetch images of users by calling above two API's using PHP script as given below.
The Complete Code
<?php
if(!empty($_POST['username'])){
$access_token = "518______63e";
$userid_url = 'https://api.instagram.com/v1/users/search?q='.urlencode($_POST['username']).'&access_token='.$access_token;
$userid_json = file_get_contents($userid_url);
$userid_array = json_decode($userid_json,true);
}
?>
<!DOCTYPE html>
<html lang="en">
<head>
<title>InstaUsers</title>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
</head>
<body>
<div class="jumbotron text-center">
<h1>Instagram User Image Searcher</h1>
</div>
<div class="container">
<div class="row">
<div class="col-md-8 col-md-offset-2">
<form action="" method="POST">
<div class="form-group">
<label for="location">User Name</label>
<input type="test" class="form-control" name="username" value="<?php if(!empty($_POST['username']))echo $_POST['username'];?>">
</div>
<button type="submit" class="btn btn-primary btn-block">SEARCH</button>
</form>
</div>
</div>
<p> </p>
<div class="row">
<?php
if(!empty($userid_array))
{ ?>
<div class="col-md-8 col-md-offset-2">
<?php
$count=0;
foreach($userid_array['data'] as $id)
{
if($count==3)
break;
$count++;
$userid = $id['id'];
$username = $id['full_name'];
echo "<hr>";
echo "<b>$username<b>";
echo "</br></br>";
// Turn off error reporting
error_reporting(0);
$instagram_url = "https://api.instagram.com/v1/users/".$userid."/media/recent/?access_token=".$access_token;
$instagram_json = file_get_contents($instagram_url);
$instagram_array = json_decode($instagram_json,true);
if(!empty($instagram_array))
{
foreach($instagram_array['data'] as $image)
{
?>
<div class="well">
<img class="img-responsive" style="padding-left:35px;" src="<?php echo $image['images']['standard_resolution']['url'] ?>" alt="Instagram Photos">
<br>
<p>Likes : <?php echo $image['likes']['count'] ?></p>
</div>
<?php
}
}
}
}
?>
</div>
</div>
</div>
</body>
</html>
I used Some Bootstrap for giving it a basic look. You can customise it according to you. The sample output image is given below.
You can demo the above app by visiting following link.